import React from 'react';
import { DragDropContext } from 'react-dnd';
import HTML5Backend from 'react-dnd-html5-backend';
import DragTag from './DragTag';
import { arr } from './constants';


class Drags extends React.Component {

  state = {
    tags: arr,
  };

  onChangeTags = (newTags) => {
    console.warn(11111, newTags);
    this.setState({
      tags: newTags,
    });
  }

  render() {

    const { tags } = this.state;

    return (
      <section>
        <DragTag
          tags={tags}
          onChangeTags={this.onChangeTags}
        />
      </section>
    );
  };
}


export default DragDropContext(HTML5Backend)(Drags);
